/**
 * Created by Administrator on 2017/12/6.
 */
import React, {PureComponent} from 'react';
import {connect} from 'dva';
import {
    Form, Input, DatePicker, Select, Button, Card, InputNumber, Radio, Icon, Switch, Cascader,
} from 'antd';
import styles from '../../routes/style.less';
import {message} from "antd/lib/index";

const FormItem = Form.Item;
const {Option} = Select;
const {RangePicker} = DatePicker;
const {TextArea} = Input;
const RadioGroup = Radio.Group;

@connect(state => ({
    submitting: state.systemConfigEdit.loading,
}))
@Form.create()
export default class SystemEditAndAdd extends PureComponent {
    handleSubmit = (e) => {
        this.props.form.validateFieldsAndScroll((err, values) => {
            if (!err) {
                this.props.handleModalVisible();
                this.props.dispatch({
                    type: this.props.editType==='add'?'systemConfigEdit/insertSystemConfig':'systemConfigEdit/updateSystemConfig',
                    payload: values,
                    callback: (response) => {
                        if (response.result === 0) {
                            message.success('提交成功');
                            this.props.handleModalSuccess(this.props.pagination);
                        } else {
                            message.success('提交失败');
                        }
                    }
                });
            }
        });
    }
    handleCancel = (e) => {
        this.props.handleModalVisible();
    }

    render() {
        const {submitting, record, editType} = this.props;
        const {getFieldDecorator, getFieldValue} = this.props.form;
        const formInitValue = editType === 'add' ? {param_status:'在用'} : record;
        if (formInitValue.param_status==='在用')
        {
            formInitValue.param_status=1;
        }else if(formInitValue.param_status==='不在用'){
            formInitValue.param_status=0;
        }
        const formItemLayout = {
            labelCol: {
                xs: {span: 24},
                sm: {span: 7},
            },
            wrapperCol: {
                xs: {span: 24},
                sm: {span: 12},
                md: {span: 10},
            },
        };

        const submitFormLayout = {
            wrapperCol: {
                xs: {span: 24, offset: 0},
                sm: {span: 10, offset: 7},
            },
        };

        return (
            <Card bordered={false}>
                <Form
                    onSubmit={this.handleSubmit}
                    hideRequiredMark
                    style={{marginTop: 8}}
                >
                    <FormItem
                        {...formItemLayout}
                        label="参数编码"
                    >
                        {getFieldDecorator('paramCode', {
                            initialValue:formInitValue.param_code||'',
                            rules: [{
                                required: true, message: '请输入参数编码',
                            }],
                        })(
                            <Input placeholder="参数编码"/>
                        )}
                        {getFieldDecorator('paramId', {
                            initialValue:formInitValue.param_id||'',
                        })(
                            <Input  type="hidden" />
                        )}

                    </FormItem>

                    <FormItem
                        {...formItemLayout}
                        label="参数名称"
                    >
                        {getFieldDecorator('paramName', {
                            initialValue:formInitValue.param_name,
                            rules: [{
                                required: true, message: '请输入参数名称',
                            }],
                        })(
                            <Input placeholder="参数名称"/>
                        )}
                    </FormItem>
                    <FormItem
                        {...formItemLayout}
                        label="参数类型"
                    >
                        {getFieldDecorator('paramGroupCode', {
                            initialValue:formInitValue.param_group_code,
                            rules: [{
                                required: true, message: '请输入参数类型',
                            }],
                        })(
                            <Input placeholder="参数类型"/>
                        )}
                    </FormItem>

                    <FormItem
                        {...formItemLayout}
                        label="参数类型中文说明"
                    >
                        {getFieldDecorator('paramGroupText', {
                            initialValue:formInitValue.param_group_text,
                            rules: [{
                                pattern:RegExp(/^[\u4e00-\u9fa5 ]/),
                                required: true, message: '请输入参数类型中文说明',
                            }],
                        })(
                            <Input placeholder="参数类型中文说明"/>
                        )}
                    </FormItem>

                    <FormItem
                        {...formItemLayout}
                        label="参数值"
                    >
                        {getFieldDecorator('paramValue', {
                            initialValue:formInitValue.param_value,
                            rules: [{
                                required: true, message: '请输入参数值',
                            }],
                        })(
                            <Input placeholder="参数值"/>
                        )}
                    </FormItem>

                    <FormItem
                        {...formItemLayout}
                        label="状态"
                    >
                        {getFieldDecorator('paramStatus', {
                            initialValue:formInitValue.param_status,
                            rules: [{
                                required: true, message: '请选择一个状态'
                            }],
                        })(
                            <Select placeholder="请选择">
                                <Option value={1}>在用</Option>
                                <Option value={0}>不在用</Option>
                            </Select>
                        )}
                    </FormItem>

                    <FormItem {...submitFormLayout} style={{marginTop: 32}}>
                        <Button type="primary" htmlType="submit" loading={submitting}>
                            提交
                        </Button>
                        <Button style={{marginLeft: 8}} onClick={this.handleCancel}>取消</Button>
                    </FormItem>
                </Form>
            </Card>
        );
    }
}
